<template>
	<view class="bg">
		<view class="my-order">
			<view class="order-header" >
				<view
					v-for="(tab,index) in tabBars" 
					:key="tab.id"
					:id="tab.id" 
					:data-current="index"
					@click="ontabtap"
					class="header-item"
					:class=' tabIndex == index?"active":"" '
				>
				{{tab.name}}</view>
			</view>
			
			<!-- <block
				v-for='(tabItem, tabI) in listData'
				:key='tabI'
			> -->
			<!-- block使用v-for循环 -->
				<!-- <view v-show='tabI === tabIndex'> -->
					<!-- <view v-if='tabItem.length > 0' class="order-main" > -->
					<view class="order-main">
						<!-- 商品  v-for='(k,i) in tabItem.list' :key="i" -->
						<view class="order-goods" v-for='(value, index) in listData' :key="index" @tap="goOrderDetails(index)">
							<view class="num-status">
								<view class="order-num">订单编号  {{value.order_no}}</view>
								<view class="goods-status">{{value.status_text}}</view>
							</view>
							<view class="goods-item">
								<!-- v-for='(item,index) in k.goods_item'-->
								<view class="goods-content"
								>
									<image class="goods-img" :src="value.goods.image" mode="widthFix"></image>
									<!-- <view class="text"> -->
										<view class="goods-text">
											<view class="goods-title">{{value.goods.title||'商品已下架'}}</view>
											<view class="goods-des">{{value.goods.title}}</view>
										</view>
										<view class="goods-n">
											<view class="goods-price">￥{{value.goods.price||"0.00"}}</view>
											<view class="goods-num">X{{value.number}}</view>
										</view>
									<!-- </view> -->
								</view>
							</view>
							
							<!-- 总价 -->
							<view class="total-price">
								合计：<text>￥{{parseFloat(value.number*value.goods.price)}}</text>
							</view>
							<!-- 支付 -->
							<!-- <view class="payment">
								<view class="payment-text">支付</view>
							</view> -->
						</view>
					</view>	
						
					</view>
				
							
					<view v-if='listData.length=="0"' class="no-order">
						<image class="no-order-img" src="http://yunzhidun.oss-cn-beijing.aliyuncs.com/weixin/static/shop/No orders.png" mode="widthFix"></image>
						<view class="no-order-home">暂时没有订单</view>
					</view>
				
				<!-- </view>
				
			</block> -->
			
		</view>
	</view>
</template>

<script>
	let App = getApp()
	export default {
		data() {
			return {
				// 当前位置
				tabIndex:0,
				// 顶部选项卡数据
				tabBars:[
					{
						name:"全部",
						id:'all',

					},
					{
						name:"待付款",
						id:'no'
					},
					{
						name:"待发货",
						id: 'yes'
					},
					{
						name:"已发货",
						id: 'ok'
					},
					{
						name:"售后",
						id: 'nook'
					},
				],
				listData: [],
				page:1,
				brandName:'',
				order_no:0,
				number:0,
				value:'',
			}
		},
		onLoad(options) {
			console.log(options)
			this.brandName = App.globalData.name
			this.getList(this.page,this.tabIndex);
			// console.log(this.tabIndex)//0
		},
		onShow(option) {
			this.status = uni.getStorageSync('orderIndex');
			this.tabIndex = uni.getStorageSync('orderIndex')*1;
			this.brandName = App.globalData.name
			// this.showType = false;
			// console.log(this.tabIndex,this.status)
		},
		onPullDownRefresh() {
			
		},
		onReachBottom() {
			this.getList(this.page*1+1,this.tabIndex);
		},
		methods: {
			//顶部切换
			changeTab(index){
				this.tabIndex=index;
				this.page = 1
				let userinfo = uni.getStorageSync('userinfo');
			},
			goOrderDetails(index){
				uni.navigateTo({
					url:`/pages/mine/orderDetails?index=${index}`,
				})
			},
			getList(page,index) {
				let userinfo = uni.getStorageSync('userinfo');
				uni.showLoading({
					title:"加载中"
				},2000)
				this.$api.interfaceApi('getOrder')({
					'uid':userinfo.id,
					'page':page,
					'status':index
				}).then(res=>{
					if(res.code == 200){
						this.listData = this.listData.concat(res.data.list)
						this.page = res.data.page
						// console.log(res) //所有，code,data,msg,time等
						// console.log(res.data)//list,page等
						// console.log(res.data.list)//list数组等
						// console.log(this.listData)//list数组等
					}
					uni.hideLoading()
				})
			},
			
			ontabtap(e) {
			    let index = e.target.dataset.current || e.currentTarget.dataset.current;
				this.tabIndex = index
				this.page=1;
				this.listData = []
			    this.getList(this.page,index);
			}
		}
	}
</script>

<style>
@import url("my-order.css");
@import url("../../../common/uni.css");
</style>
